// Menu Modernization Animations
// Phase 1: Foundation & Structure

// ============================================
// Keyframe Animations
// ============================================

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}

@keyframes glow-pulse {
  0%, 100% {
    box-shadow: 0 0 8px rgba(168, 85, 247, 0.3);
  }
  50% {
    box-shadow: 0 0 16px rgba(168, 85, 247, 0.6);
  }
}

// ============================================
// Animation Utilities
// ============================================

// Badge pulse animation
$badge-animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;

// Glow pulse animation
$glow-animation: glow-pulse 2s ease-in-out infinite;

// ============================================
// Transition Mixins
// ============================================

@mixin transition-standard {
  transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
}

@mixin transition-slow {
  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

@mixin transition-theme {
  transition: background-color 500ms ease-in-out,
              color 500ms ease-in-out,
              border-color 500ms ease-in-out;
}
